<template>
  <div>
     <div style="display: flex; justify-content: space-between; width: 900x; margin: 20px auto;">
      <div style="display: flex;"><el-input v-model="queryForm.searchText"></el-input><el-button type="primary" @click="getList">查询</el-button> </div>
      <el-button type="primary" @click="toOpen">添加</el-button>
    </div>
    <baseForm ref="baseFormRef" :formData="FormData" :isDialog="true" @submit="toAdd"></baseForm>
    <commonTable @sendPage="getList" :tableData="adminList" :columns="columns" titleText="管理员列表">
      <template #title>
          <el-icon size="40"><Menu /></el-icon>
      </template>
      <template #action="{row}">
          <el-link type="primary" @click="toEdit(row)">编辑</el-link>
           <el-link type="danger" @click="toDel(row.tokenId)">删除</el-link>
      </template>
    </commonTable>
    
  </div>
</template>
<script setup >
import commonTable from '@/components/table/index.vue'
import baseForm from '@/components/form/index.vue'
import {Menu} from '@element-plus/icons-vue'
import {columns,FormData} from './adminData'
import {getAdminList,addAdminApi,updateAdmin,toDelAdmin } from '@/api/admin'
import {ref,reactive,onMounted} from 'vue'

import { ElMessage } from 'element-plus'
let queryForm=reactive({
  pageStart:1,
  searchText:"" //查询条件
})
let adminList=ref()
// 获取管理员列表
let getList=async (page=1)=>{
  queryForm.pageStart=page
  let res=await getAdminList(queryForm)
  console.log(res,"---------")
  adminList.value=res.data;
}

  getList();

  let baseFormRef=ref(null)

 let toOpen=()=>{
  // 子组件方法
      baseFormRef.value.open()
 }
 let toAdd=async (addForm)=>{
    addForm.password='123456'
    if(addForm.tokenId){
      let editRes=await updateAdmin(addForm)
       ElMessage.success('编辑成功')
    }else{
          let res=await addAdminApi(addForm)
        ElMessage.success('添加成功')
    }

    baseFormRef.value.close()
    getList();
 }
//  回显
let toEdit=(row)=>{
  console.log(row,"-----------")
    baseFormRef.value.setFormVal(row)
}
// 删除方法
let toDel=async (tokenId)=>{
  let res=await toDelAdmin(tokenId)
  ElMessage.success('删除成功')
  getList();
}
</script>